import React, { Component } from "react";
import Banner from "./components/Banner";
import "./Brunei.scss";
import { bruneiJobInfo } from "./../../constant/bruneiJob";
import { Table } from "@icedesign/base";

export default class BruneiPage extends Component {
  static displayName = "BruneiPage";

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {
      selectLi: 0
    };
  }
  selectJobType = e => {
    this.setState({
      selectLi: Number(e.target.id)
    });
  };
  getResumes = record => {
    window.open(record.url);
  };
  renderJobUrl = (value, index, record) => {
    return <span className="brunei-resumes">投递简历</span>;
  };
  render() {
    return (
      <div className="content">
        <div className="brunei-banner">
          <img src="https://restaurant.hengyi.com/photos/qiniuyun/shool-banner.jpg" />
        </div>
        <div className="brunei-introduce">
          <div className="brunei-introduce-title">恒逸文莱(PMB)项目</div>
          <div className="brunei-introduce-text">
            恒逸（文莱）PMB石油化工项目作为我国“一带一路”倡议中的重大项目，是由我司和文莱政府合资建设的千万吨炼油化工一体化项目。项目位于文莱达鲁萨兰国（Brunei
            Darussalam），依托文莱丰富的石油资源和良好的投资政策环境，石油是国家的战略资源，可以说是国家发展的命脉。项目分两期实施，总投资额超100亿美元，预计2019年投产，PX、苯、汽油、柴油、航空煤油、硫磺、芳烃、乙烯等产品将相继出产。特面向社会招聘石油化工项目各类优秀管理、技术人才。
          </div>
        </div>

        {/*<img
          className="cpyc-title-img"
          src="https://restaurant.hengyi.com/photos/qiniuyun/cpyc.png"
    />*/}
        <div className="job">
          <div className="job-left">
            <ul onClick={this.selectJobType}>
              {bruneiJobInfo.map((item, index) => {
                return (
                  <li
                    className={this.state.selectLi === index ? "sel" : ""}
                    id={index}
                    key={item.type}
                  >
                    {item.type}
                  </li>
                );
              })}
            </ul>
            <div className="qrcode">
              <img src="http://www.hengyi.com/page/pics/20180808/201808081533717840368.jpg" />
              <div className="qrcode-text">
                关注"恒逸微招聘"
                <br />
                了解更多动态
              </div>
            </div>
          </div>
          <div className="job-right">
            <Table
              dataSource={bruneiJobInfo[this.state.selectLi].positions}
              onRowClick={this.getResumes}
              hasBorder={false}
              isZebra={true}
              primaryKey="name"
            >
              <Table.Column
                title="职位名称"
                dataIndex="name"
                align="center"
                className="job-table-col"
              />
              <Table.Column
                title="工作地点"
                dataIndex="place"
                align="center"
                className="job-table-col"
              />
              <Table.Column
                title="简历入口"
                cell={this.renderJobUrl}
                align="center"
                className="job-table-col"
              />
            </Table>
          </div>
        </div>
      </div>
    );
  }
}
